/** @type {import('vite').UserConfig} */
import { defineConfig } from 'vite';
import { resolve } from 'path';
import vue from '@vitejs/plugin-vue';
import AutoImport from 'unplugin-auto-import/vite'; //自动引入插件 vue 等api
import Components from 'unplugin-vue-components/vite'; //自动引入组件插件
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'; //自动引入ElementPlus插件
import { createHtmlPlugin } from 'vite-plugin-html';
import { visualizer } from 'rollup-plugin-visualizer';
import viteCompression from 'vite-plugin-compression';
import ViteRestart from 'vite-plugin-restart';
import vuejsx from '@vitejs/plugin-vue-jsx';
import vueSetupExtend from 'vite-plugin-vue-setup-extend';
import postceePresetEnv from 'postcss-preset-env';
// import viteImagemin from 'vite-plugin-imagemin'
// console.log(process.argv[process.argv.length - 1]);

export default (env: any) =>
    defineConfig({
        base: './',
        server: {
            host: '0.0.0.0',
            port: 5001, // 指定开发服务器端口
            strictPort: true, // 若端口已被占用则会直接退出
            // https: false, // 启用 TLS + HTTP/2
            open: true, // 启动时自动在浏览器中打开应用程序
            // compress: true,
            hmr: true, // 开启热更新
            cors: true, // 允许跨域
            proxy: {
                '/api': {
                    target: 'http://127.0.0.1:9588',
                    changeOrigin: true,
                    rewrite: (path) => path.replace(/^\/api/, '')
                }
            }
        },

        //别名
        resolve: {
            alias: {
                '@': resolve(__dirname, 'src'), // @相当于src 文件夹目录
                types: resolve(__dirname, 'src/types'),
                img: resolve(__dirname, 'src/assets/img'),
                utils: resolve(__dirname, 'src/utils'),
                api: resolve(__dirname, 'src/api'),
                store: resolve(__dirname, 'src/store'),
                hooks: resolve(__dirname, 'src/hooks')
            },
            // dedupe: [], // 强制 Vite 始终将列出的依赖项解析为同一副本
            // conditions: [], // 解决程序包中 情景导出 时的其他允许条件
            // mainFields: [], // 解析包入口点尝试的字段列表
            extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.css'], // 导入时想要忽略的扩展名列表
            preserveSymlinks: false // 启用此选项会使 Vite 通过原始文件路径确定文件身份
        },
        css: {
            postcss: {
                // 内联的 PostCSS 配置 如果提供了该内联配置，Vite 将不会搜索其他 PostCSS 配置源
                plugins: [postceePresetEnv()]
            },
            preprocessorOptions: {
                // css的预处理器选项
                scss: {
                    additionalData: `$injectedColor: orange;@import "@/assets/style/variables.scss";`
                }
            },
            devSourcemap: true
        },
        define: {
            // 在生产构建中启用水合不匹配细节
            __VUE_PROD_HYDRATION_MISMATCH_DETAILS__: 'true'
        },

        json: {
            namedExports: true, // 是否支持从.json文件中进行按名导入
            stringify: false //  开启此项，导入的 JSON 会被转换为 export default JSON.parse("...") 会禁用按名导入
        },
        plugins: [
            //vue 包
            vue(),
            //jsx组件中自动跳过生命周期，即jsx中没有生命周期，在父组件onBeforeMount后执行
            vuejsx(),
            //vue3语法糖默认是没有name属性的，在我们使用keep-alive的时候需要用到name <script setup lang="ts" name="home"></script>
            vueSetupExtend(),
            // 给静态 index.html 添加变量
            createHtmlPlugin({
                minify: true,
                /**
                 * 在这里写entry后，你将不需要在`index.html`内添加 script 标签，原有标签需要删除
                 * @default src/main.ts
                 */
                // entry: '/src/main.ts',
                /**
                 * 需要注入 index.html ejs 模版的数据
                 */
                inject: {
                    data: {
                        injectTitle: env.VITE_APP_TITLE,
                        injectApp: '<div id="app"></div>',
                        injectScript: `<script type="module" src="/src/main.ts"></script>`
                    }
                }
            }),
            //自动引入需要的方法，如 ref
            AutoImport({
                resolvers: [ElementPlusResolver()],
                imports: ['vue', 'vue-router', 'pinia'],
                dts: 'src/auto-import-vue.d.ts' //存放位置
            }),
            //按需引入组件库
            Components({
                //自己的组件
                dirs: ['src/components'], // 目标文件夹
                extensions: ['vue', 'jsx'], // 文件类型
                //组件库
                resolvers: [ElementPlusResolver()],
                dts: 'src/auto-import.d.ts' //存放位置
            }),
            //修改 config 后不用重启
            ViteRestart({
                restart: ['vite.config.ts', 'vite.base.ts', 'vite.build.ts']
            }),
            //打包后打开包体积分布情况
            visualizer({ open: false })
            // 压缩代码
            // viteCompression({
            //   verbose: true, // 是否在控制台中输出压缩结果
            //   disable: false,
            //   threshold: 10240, // 如果体积大于阈值，将被压缩，单位为b，体积过小时请不要压缩，以免适得其反
            //   algorithm: 'gzip', // 压缩算法，可选['gzip'，' brotliccompress '，'deflate '，'deflateRaw']
            //   ext: '.gz',
            //   deleteOriginFile: true // 源文件压缩后是否删除
            // }),
            //压缩图片
            // viteImagemin({
            //   gifsicle: {
            //     optimizationLevel: 7,
            //     interlaced: false
            //   },
            //   optipng: {
            //     optimizationLevel: 7
            //   },
            //   mozjpeg: {
            //     quality: 20
            //   },
            //   pngquant: {
            //     quality: [0.8, 0.9],
            //     speed: 4
            //   },
            //   svgo: {
            //     plugins: [
            //       {
            //         name: 'removeViewBox'
            //       },
            //       {
            //         name: 'removeEmptyAttrs',
            //         active: false
            //       }
            //     ]
            //   }
            // })
        ],
        preview: {
            host: 'localhost',
            port: 4200, //端口号
            open: true, //是否自动打开浏览器
            cors: true, // 允许跨域
            proxy: {
                // 配置自定义代理规则,=============此处为 preview 服务配置，开发环境无效
                // '/api': {
                // 	target: 'http://jsonplaceholder.typicode.com',
                // 	changeOrigin: true,
                // 	rewrite: (path) => path.replace(/^\/api/, '')
                // }
            }
        }
    });
